<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>js9.2 BOM window对象演示</title>
	</head>
	<body>
		
		<button id="btn1" onclick="newWindow()">打开新窗口</button>
		<button id="btn2" onclick="validClosed()">验证窗口是否关闭</button>
		<button id="btn3" onclick="showInnerSize()">显示窗口的innerWidth和innerHeight</button>
		<button id="btn4" onclick="showOuterSize()">显示窗口的outerWidth和outerHeight</button>
		<button type="button" onclick="useOpener()">打开新窗口使用window.opener</button>
		<button type="button" onclick="useClose()">要不要关闭呢？</button>
		<button type="button" onclick="useOpen()">打开吧！新世界！</button>
		<button type="button" onclick="useOpen2()">打开吧！新世界2！</button>
		<button type="button" onclick="useOpen3()">打开吧！新世界3！</button>
		
 		 <br  />
		<iframe id="ifm1" src="1.html">
			
		</iframe>
		<iframe id="ifm2" src="2.html">
			
		</iframe>
		<iframe id="ifm3" src="3.html">
			
		</iframe>
		<br  />
		<a href="http://baidu.com" target="_blank">打开百度</a>
		<script type="text/javascript">
			
			// 若是iframe中指向的页面也有iframe框架.并不影响当前页面的数量
			console.log("当前页面的iframe框架数量为");
			console.log(window.frames.length);
			
			// 打开百度到新窗口
			function useOpen(){
				// 只打开一个新窗口
				// window.open("http://weibo.com");
				// 第二个 参数为窗口名。若传递窗口名。则此地址只会在窗口名对应的窗口打开
				window.open('http://weibo.com', 'baidu')
				
			}
			function useOpen2(){
				// 若指定的窗口名已打开.则在窗口名所属的窗口打开指定页面.
				// 若指定窗口名未打开.则打开新的窗口浏览指定页面
				window.open('http://douban.com', 'baidu')
				
			}
			
			// 打开窗口并设置各种参数
			function useOpen3(){
				/*
				window.open 弹出新窗口的命令；
			　　'http://baidu.com' 弹出窗口的url；
			　　'newwindow' 弹出窗口的名字（不是文件名），非必须，可用空'代替；
			　　height=100 窗口高度；
			　　width=500 窗口宽度；
			　　top=0 窗口距离屏幕上方的象素值；
			　　left=0 窗口距离屏幕左侧的象素值。
				toolbar=no,   工具栏
				menubar=no,   菜单栏
				scrollbars=no,   滚动条
				resizable=no    是否允许设置尺寸
				*/
				window.open('http://baidu.com', 'newwindow', 'height=100, width=400, top=0,left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no')
			}
			
			function useClose(){
				/* 第一种询问方式
				if(!confirm("是否要关闭当前窗口？"))
					return;
				window.close();
				*/
			   
			    // 第二种询问方式
				if(confirm("是否要关闭当前窗口？")){
					window.close();
				}
			}
			
			var window1;
			function newWindow(){
				// window.open 会打开指定url的新页面
				// 返回值为新页面的window对象
				window1 = window.open("http://www.baidu.com");
			}
			
			// validClosed函数用于演示window.closed，此属性表示窗口是否被关闭
			function validClosed(){
				if(window1.closed){
					alert("弹出的窗口已关闭");
				}else{
					alert("弹出的窗口未关闭");
				}
				
			}
			
			function showInnerSize(){
				// 该尺寸随窗体缩放而改变。以像素计算。不包含菜单栏、工具栏以及滚动条等的高度
				alert("当前window的innerHeight=" + window.innerHeight + ";当前window的innerWidth=" + window.innerWidth);
			}
			
			function showOuterSize(){
				// 该尺寸随窗体缩放而改变。以像素计算。浏览器的总宽高
				alert("当前window的outerHeight=" + window.outerHeight + ";当前window的outerWidth=" + window.outerWidth);
			}
			
			function useOpener(){
				var myWindow = window.open('http://baidu.com')
				myWindow.document.write("This is 'myWindow'")
				myWindow.focus()
				myWindow.document.write("<h3>生成此页面的 url=" + myWindow.opener.location.href + "</h3>");
			}
			 
		</script>
	</body>
</html>
